require(['./config'], () => {
  // 先引入config，让哪些配置生效，然后就可以使用配置好的段名称来引入需要的模块
  require(['jquery'],function(){
	  require(['swiper', 'template', 'listofheader', 'listoffooter'], (Swiper,template) => {
		// 这个函数是在所有依赖模块执行完了之后执行
		class Index {
		  constructor () {
			this.init()
			if (this.cart) {
			  this.calcTotalMoney()
			  this.checksChange()
			  this.setAllCheck()
			  this.addandreduce()
			  this.del()
			  this.allCheck()
			}
		  }
		  init () {
			// 取出localStorage里存的购物车数据
			const cart = localStorage.getItem('cart')
			if (cart) {
			  // 渲染表格
			  this.cart = JSON.parse(cart)
			  $('#shop_tbody').html(
			    template('cartTemplate', { cart: this.cart })
			  )
			console.log(this.cart)
			} else {
			  $('#cartFull').hide()
			  $('#cartEmpty').show()
			}
		  }
		  
		  checksChange () {
		    const _this = this
		    $('.checks').on('change', function () {
		      // 从父级tr身上取到自定义属性data-id
		      const id = $(this).parents('tr').data('id')
		      _this.cart = _this.cart.map(shop => {
		        if (shop.id === id) {
		          shop.check = $(this).prop('checked')
		        }
		        return shop
		      })
		      // 把修改好的cart重新存localStorage
		      localStorage.setItem('cart', JSON.stringify(_this.cart))
		      // 重新计算一次总价
		      _this.calcTotalMoney()
		      // 重新设置全选
		      _this.setAllCheck()
		    })
		  }
		  setAllCheck () {
		    $('#select-all').prop('checked', this.cart.every(shop => shop.check))
		  }
		  
		  calcTotalMoney () {
		    // 第一次遍历的时候：
		    //   后面初始值就是money的值为0，shop就是this.cart[0]
		    //   判断shop是否选中，是的话money就加上这条商品的小计价格，并且把money return出去
		    // 第一次的return会作为下一次的money参数继续计算，这个时候shop就是this.cart[1]
		    //    再去判断shop是否选中，如果没有选中，那就直接return上一次的money，继续参与第三次运算
		    // 当遍历结束，外面的total拿到的就是最后所有选中商品的总价了
		    const total = this.cart.reduce((money, shop) => {
		      if (shop.check) {
		        money += shop.price * shop.count
		      }
		      return money
		    }, 0)
		    $('#Paymoney').html(total.toFixed(2))
		  }
		  
		  
		  
		  
		  //数量加减
		  addandreduce () {
		    const _this = this
		    $('.add0').on('click', function () {
			  console.log(123)
		      const id = $(this).parents('tr').data('id')
		      _this.cart = _this.cart.map(item => {
		        if (item.id === id) {
		          item.count++;
				  $(this).parent('.sel-num').children('input')[0].value++;
		        }
		        return item
		      })
		      // 把修改好的cart重新存localStorage
		      localStorage.setItem('cart', JSON.stringify(_this.cart))
		      // 重新计算一次总价
		      _this.calcTotalMoney()
		    })
			
			
			$('.reduce0').on('click', function () {
			  console.log(123)
			  const id = $(this).parents('tr').data('id')
			  _this.cart = _this.cart.map(item => {
			    if (item.id === id) {
			      item.count--;
				  $(this).parent('.sel-num').children('input')[0].value--;
				  if(item.count===0){
					  alert('确定删除吗')
					  item.count=0;
					  $(this).parents('.tr').remove()
					  _this.f(index)
					  
					  
				  }
			    }
			    return item
			  })
			  // 把修改好的cart重新存localStorage
			  localStorage.setItem('cart', JSON.stringify(_this.cart))
			  // 重新计算一次总价
			  _this.calcTotalMoney()
			})
		  }
		  
		  //删除
		  del () {
		    const _this = this
		    $('.delete').on('click', function () {
		      const id = $(this).parents('tr').data('id')
			  let index = $(this).parents('tr').attr('data-index')
		      _this.cart = _this.cart.map(item => {
		        if (item.id === id) {
		          item.count=0;
				  $(this).parents('.tr').remove()
				  // console.log(_this.cart)
				  
				 //  _this.cart.map(item =>{
					//   if(item.count===0){
					// 	  console.log(item)
					// 	_this.cart.splice(index,1)
						
					// }
				 //  })
				
		        }
		        return item
		      })
			  console.log(_this.cart)
			  
		      // 把修改好的cart重新存localStorage
			  localStorage.setItem('cart', JSON.stringify(_this.cart))
		      // 重新计算一次总价
		      _this.calcTotalMoney()
			   _this.f(index)
		    })
		} 
		//删除辅助
		f(ind){
			var cart2 = JSON.parse(localStorage.getItem('cart'))
			cart2.splice(ind,1)
			localStorage.setItem('cart', JSON.stringify(cart2))
			
		}
		//全选
		 allCheck() {
		     const _this = this
		     $('#select-all').on('change', function() {
		         _this.cart = _this.cart.map(shop => {
		                 shop.check = $(this).prop('checked')
		                 return shop
		             })
		             //将全选状态的值给checks的checked属性
		         $('.checks').prop('checked', $(this).prop('checked'))
		         localStorage.setItem('cart', JSON.stringify(_this.cart))
		         _this.calcTotalMoney()
				_this.setAllCheck()
		     })
		 }
		
		
		  
		}
		new Index()
	  })
	})
	  
  })

